<!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<meta name="description" content="">
		<meta name="author" content="">
		<title>修改城市</title>
		<link rel="stylesheet" href="../../../css/base.css" />
		<link rel="stylesheet" href="../../../css/common.css" />
		<link rel="stylesheet" type="text/css" href="creat-city.css">
		<!-- Bootstrap Core CSS -->
		<link href="../../../sbadmin/bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
		<!-- MetisMenu CSS -->
		<link href="../../../sbadmin/bower_components/metisMenu/dist/metisMenu.min.css" rel="stylesheet">
		<!-- DataTables CSS -->
		<link href="../../../sbadmin/bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css" rel="stylesheet">
		<!-- Custom CSS -->
		<link href="../../../sbadmin/dist/css/sb-admin-2.css" rel="stylesheet">
		<!-- Custom Fonts -->
		<link href="../../../sbadmin/bower_components/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
		<script src="https://gosspublic.alicdn.com/aliyun-oss-sdk-4.4.4.min.js"></script>
		<script src="ul_file.js"></script>
		<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
		<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
		<!--[if lt IE 9]>
	<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
	<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
	<![endif]-->
	</head>

	<body style="background:#fff;">
		<div class="container-fluid" style="background-color: #fff;">
			<div class="title">
				<span style="font-weight: bold;">城市管理 > 修改城市</span>
			</div>
			<div class="ubdatebox">
				<div class="cityname pr">
					<span class="name">城市名：</span>
					<input type="text" class="nameinput" id="ctName" />
					<ul class="showboxul none">
					</ul>
				</div>
				<div class="cityname">
					<span class="name">英文：</span>
					<input type="text" class="nameinput" id="ctEname" />
				</div>
				<div class="cityname clearfix">
					<span class="name fl">城市图片：</span>
					<div class="namebox fl">
						<input type="file" class="file-style" id="file" onchange="xmTanUploadImg(this)" />
						<img id="xmTanImg" src="" class="namepic" />
						<input type="hidden" id="imghidden" value="" />
					</div>
					<div class="fl m10" style="margin-top: 40px;">
						(建议尺寸718*130)
					</div>
				</div>
				<div class="btntbox">
					<a href="../city/city.html" class="lbtn fl">取消</a>
					<div class="rbtn fl" id="updateCityBtn">确定</div>
				</div>
			</div>
		</div>
		<!-- jQuery -->
		<script src="../../../sbadmin/bower_components/jquery/dist/jquery.min.js"></script>
		<!-- Bootstrap Core JavaScript -->
		<script src="../../../sbadmin/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
		<!-- Metis Menu Plugin JavaScript -->
		<script src="../../../sbadmin/bower_components/metisMenu/dist/metisMenu.min.js"></script>
		<!-- DataTables JavaScript -->
		<script src="../../../sbadmin/bower_components/datatables/media/js/jquery.dataTables.min.js"></script>
		<script src="../../../sbadmin/bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.min.js"></script>
		<!-- Custom Theme JavaScript -->
		<script src="../../..//sbadmin/dist/js/sb-admin-2.js"></script>
		<!-- Page-Level Demo Scripts - Tables - Use for reference -->
		<script src="../../../js/layer/layer.js"></script>
		<script type="text/javascript" src="../../../js/jquery-ui.min.js"></script>
		<!--<script src="creat-city.js"></script>-->
	</body>
	<script>
		//会员卡照片
		var img = document.getElementById("xmTanImg");

		function xmTanUploadImg(obj) {
			$("#ttt").css("display", "none");
			var file = obj.files[0];
			var reader = new FileReader();
			//读取文件过程方法
			reader.onloadstart = function(e) {
				console.log("开始读取....");
			}
			reader.onprogress = function(e) {
				console.log("正在读取中....");
			}
			reader.onabort = function(e) {
				console.log("中断读取....");
			}
			reader.onerror = function(e) {
				console.log("读取异常....");
			}
			reader.onload = function(e) {
				console.log("成功读取....");
				img.src = e.target.result;
				// 保存会员照片
				localStorage.setItem("memberPhone", img.src);
				var icinmguuii = document.getElementsByClassName("ic-inmguuii")[0];
				//icinmguuii.style.display = "block";
				//或者 img.src = this.result;  //e.target == this
			}
			reader.readAsDataURL(file);
			applyTokenDo(uploadFile);

		}

		function searchCity() {
			var searchName = $("#ctName").val();
			var html = "";
			if(searchName == "") {
				html += "";
				$(".showboxul").hide();
			} else {
				$(".showboxul").show();
				$.ajax({
					url: "https://order.wz1996.wang/wzbg/area/like?city=" + searchName,
					type: 'GET',
					contentType: 'application/json',
					beforeSend: function(request) {
						request.setRequestHeader("token", localStorage.getItem("token"));
					},
					success: function(data) {
						console.log(data)
						if(data.code == "1") {
							for(var i = 0; i < data.data.length; i++) {
								html += "<li id=" + data.data[i].id + ">" + data.data[i].name + "</li>"
							}
							$(".showboxul").html(html)
						} else if(data.code == "-1") {
							layar(data.msg);
							setTimeout("window.parent.frames.location.href='/xcxadmin/login.html'", 1000)
						}

					},
					error: function(e) {
						errcode(e);
					}
				});
			}

		}
		$('#ctName').bind('input propertychange', function() {
			searchCity();
		});
		$('#ctName').click(function() {
			if($('#ctName').val() == "") {
				return;
			} else {
				searchCity();
			}
		})
		$(".showboxul").on("click", "li", function() {
			var id = $(this).attr("id");
			var crname = $(this).html();
			$("#ctName").val(crname);
			$("#ctName").attr("cid", id);
			$(".showboxul").hide();
		})
		var updateId = localStorage.getItem("updateId");
		//查询城市
		$.ajax({
			url: "https://order.wz1996.wang/wzbg/openedcity/one/" + updateId,
			type: 'GET',
			contentType: 'application/json',
			beforeSend: function(request) {
				request.setRequestHeader("token", localStorage.getItem("token"));
			},
			success: function(data) {
				console.log(data)
				if(data.code == "1") {
					$("#ctName").val(data.data.cityName);
					$("#ctName").attr("cid", data.data.cityId);
					$("#ctEname").val(data.data.cityNameEn);
					$("#xmTanImg").attr("src", data.data.imageUrl)
					$("#imghidden").val(data.data.imageUrl);
				} else if(data.code == "-1") {
					layar(data.msg);
					setTimeout("window.parent.frames.location.href='/xcxadmin/login.html'", 1000)
				} else {
					layar(data.msg);
				}

			},
			error: function(e) {
				errcode(e);
			}
		});

		$("#updateCityBtn").click(function() {
			var ctId = $("#ctName").attr("cid");
			var ctName = $("#ctName").val();
			var ctEname = $("#ctEname").val();
			var ctImg = $("#imghidden").val();
			var post_data = {
				id: updateId,
				cityId: ctId,
				cityName: ctName,
				cityNameEn: ctEname,
				imageUrl: ctImg
			};
			$.ajax({
				url: "https://order.wz1996.wang/wzbg/openedcity/update",
				type: 'PUT',
				contentType: 'application/json',
				data: JSON.stringify(post_data),
				beforeSend: function(request) {
					request.setRequestHeader("token", localStorage.getItem("token"));
				},
				success: function(data) {
					console.log(data);
					//登录状态
					if(data.code == "1") {
						layer.msg("修改成功！", {
							offset: '20%'
						});
						setTimeout("window.location.href='../city/city.html'", 1000)
					} else if(data.code == "-1") {
						layar(data.msg);
						setTimeout("window.parent.frames.location.href='/xcxadmin/login.html'", 1000)
					} else {
						layer.msg(data.msg, {
							offset: '20%'
						});
					}
				},
				error: function(e) {
					errcode(e);
				}
			});

		})
	</script>

</html>